<#include "/public/secfield.html">
<script src="/js/audioplayer.min.js"></script>
<link rel="stylesheet" href="/css/audioplayer.css">
<div class="site-h1" style="padding-top:10px;padding-bottom:0px;border-bottom: 0px;margin-bottom: 0px;">
	<ul class="layui-tab-title ukefu-call-title">
		<!-- <li class="layui-this">客户详情</li> -->
		<li class="layui-this">聊天记录<#if agentServiceList??>（${agentServiceList.totalElements}）<#else>（0）</#if></li>
		<#if models?? && models["callcenter"]?? && models["callcenter"] == true>
		<li>通话历史<#if statusEventHisList??>（${statusEventHisList.totalElements}）</#if></li>
		</#if>
		<!-- <li>计划任务</li>  -->
		<li>服务小结<#if summaryList??>（${summaryList?size}）<#else>（0）</#if></li>
		<#if statusEvent.record>
		<li>录音查听</li>
		</#if>
		<!-- <li>知识库</li> -->
		<!-- <li>知识库查询</li> -->
		<#if models?? && models["workorders"]?? && models["workorders"] == true>
		<li>工单信息</li>
		</#if>
		<#if models?? && models["callcenter"]?? && models["callcenter"] == true>
		<li>名单信息</li>
		<li>营销记录</li>
		</#if>
		<#if agentUserMessageList?? && agentUserMessageList.content?size gt 0>
		<li>对话内容</li>
		</#if>
		<#if user.superuser?? && user.superuser== true>
		<!-- <li>事件消息</li> -->
		</#if>
		<li>动态信息</li>
	</ul>
</div>
<div class="ukefu-softphone-contacts-body ukefu-contacts-detail">
	<div class="row" style="height:100%;">
		<div class="col-lg-12">
			<div class="box"  style="height:100%;">
				<div class="box-body" id="ukefu_contacts_detail" style="height:100%;">
					<div class="layui-tab" style="height:100%;">
					  <div class="layui-tab-content ukefu-call-content" style="padding:0px 10px;height:100%;">
					  	<!-- 聊天记录  -- 分界线 -->
					    <div class="layui-tab-item layui-show">
					    	<div id="agentserviceList">
								<#include "/apps/business/contacts/include/agentservicelist.html">	
							</div>	
							<div class="row" style="padding:5px;">
								<div class="col-lg-12" id="agentservice_page" style="text-align:center;"></div>
							</div>
					    </div>
					    <#if models?? && models["callcenter"]?? && models["callcenter"] == true>
					    <!-- 通话历史  -- 分界线 -->
					    <div class="layui-tab-item"  >
					    	<div id="historyList">
								<#include "/apps/business/callcenter/service/detail/statuseventhislist.html">
							</div>
							<div class="row" style="padding:5px;">
								<div class="col-lg-12" id="page" style="text-align:center;"></div>
							</div>	
					    </div>
					    </#if>
					    
					   	<div class="layui-tab-item">
					    	<div class="box" style="height:100%;" >
								<div class="box-title" style="height:45px;">
									<h1 class="site-h1" style="padding-bottom: 9px;">
										服务小结列表
										<div class="ukefu-bt-text-content" style="position: absolute;right: 5px;top: 0px;">
											<div style="float:right;">
												<button class="layui-btn layui-btn-sm green" href="/apps/contacts/summary/add.html?statuseventid=${statusEvent.id!''}&contactsid=${contacts.id!''}" data-toggle="ajax" title="新建服务小结" data-width="950" data-height="500">新建服务小结</button>	
											</div>
										</div>
									</h1>
								</div>
								<div class="box-body" id="summarys">
									<#include "/apps/business/contacts/summary/summarylist.html">
								</div>
							</div>
					    </div>
					    
					    <!-- 录音查听  -- 分界线 -->
					    <#if statusEvent.record>
					    <div class="layui-tab-item">
					    	<div class="uk-layui-form">
								<div class="layui-collapse">
									<div class="layui-colla-item">
										<h2 class="layui-colla-title">录音信息</h2>
										<div class="layui-colla-content layui-show">
											<div class="layui-form-item">
												<div class="layui-inline">
													<label class="layui-form-label">录音开始：</label>
													<div class="layui-input-inline">
														<#if statusEvent.startrecord??>${statusEvent.startrecord?string('yyyy-MM-dd HH:mm:ss')}</#if>
													</div>
												</div>
												<div class="layui-inline uckefu-inline">
													<label class="layui-form-label" >录音时长：</label>
													<div class="layui-input-inline">
														<#assign recordtime = statusEvent.recordtime/1000>
														${(recordtime/3600)?floor?string('00')}:${(recordtime%3600/60)?floor?string('00')}:${(recordtime%60)?floor?string('00')}
													</div>
												</div>
											</div>
										</div>
									</div>
									<div class="layui-colla-item">
										<h2 class="layui-colla-title">
											录音文件：
											<!-- <#if !statusEvent.distype?? && !statusEvent.distype == '' && statusEvent.createtime??>
												${statusEvent.createtime?string("yyyy-MM-dd HH:mm:ss")}
											<#else>
												${statusEvent.recordfilename!''}	
											</#if> -->
										</h2>
										<div class="layui-colla-content layui-show">
											<div class="layui-form-item">
												<div class="layui-inline" style="width:100%;">
													<div class="layui-input-inline" style="width:100%;">
														<audio preload="auto" controls>
															<source src="/apps/resource/voice/${statusEvent.id!''}.wav">
														</audio>
													</div>
												</div>
											</div>
										</div>
									</div>
									<div class="layui-colla-item">
										<h2 class="layui-colla-title">
											录音下载：
										</h2>
										<div class="layui-colla-content layui-show">
											<#if statusEvent.createtime??><a  href="/apps/resource/voice/${statusEvent.id!''}.wav" target="_blank">${statusEvent.createtime?string("yyyy-MM-dd HH:mm:ss")}</a></#if>
										</div>
									</div>
								</div>
							</div>
					    </div>
					    </#if>
					    <!-- 工单信息  -- 分界线 -->
					    <#if models?? && models["workorders"]?? && models["workorders"] == true>
					    <div class="layui-tab-item">
					    	<div class="box" style="height:100%;">
								<div class="box-title" style="height:45px;">
									<h1 class="site-h1" style="padding-bottom: 9px;">
										工单列表
										<div class="ukefu-bt-text-content" style="position: absolute;right: 5px;top: 0px;">
											<div style="float:right;">
												<button class="layui-btn layui-btn-sm layui-btn-normal" href="/apps/workorders/embed/add.html?ani=${statusEvent.ani!''}&eventid=${statusEvent.id!''}&source=callcenter&contactsid=${contactsid!''}" data-toggle="ajax" title="新建工单" data-width="950" data-height="500">新建工单</button>	
											</div>
										</div>
									</h1>
								</div>
								<div class="box-body" id="workorders">
									<#include "/apps/business/callcenter/softphone/workorders.html">
								</div>
							</div>
					    </div>
					    </#if>
					    
					    <#if models?? && models["callcenter"]?? && models["callcenter"] == true>
					    <!-- 名单信息  -- 分界线 -->
					    <div class="layui-tab-item">
							<div class="box">
								<div class="box-title">
									<h1 class="site-h1">
										外呼名单信息
									</h1>
								</div>
								<div class="box-body" id="ukefu_contacts_info">
										<#include "/apps/business/contacts/callout/name.html">
									</div>
								</div>
						</div>
						<!-- 营销记录  -- 分界线 -->
						<div class="layui-tab-item">
							<div class="box">
								<div class="box-title">
									<h1 class="site-h1">
										营销记录<#if callOutNamesHisList??>（${callOutNamesHisList.totalElements}）<#else>（0）</#if>
										<#if models?? && models["sales"]?? && models["sales"] == true && contactsItem?? && contacts??>
										<div style="float:right;">
											<button class="layui-btn layui-btn-sm" href="/apps/contacts/reservation/add.html?contactsid=${contacts.id!''}&statusCode=${contactsItem.statuscode!''}" data-toggle="ajax" title="新建营销记录" data-width="750" data-height="400"><i class="kfont">&#xe65c;</i>新建营销记录</button>	
										</div>
										</#if>
									</h1>
								</div>
								<div id="callOutNamesHis">
									<#include "/apps/business/contacts/apdetalist.html">
								</div>
							</div>
						</div>
					    </#if>
					    
				    	<!-- 动态信息  -- 分界线 -->
						<div class="layui-tab-item">
							<div class="box">
								<div class="box-title">
									<h1 class="site-h1">
										动态信息
									</h1>
								</div>
								<div class="box-body" id="ukefu_contacts_dy" style="line-height:25px;">
									<#include "/apps/business/contacts/include/dynform.html">
								</div>
							</div>
						</div>
					  </div>
					 </div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script>
	layui.use('element', function() {
		var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
		element.init();
	});
	$( 'audio' ).audioPlayer();
	$('.ukefu-call-title li').on("click" , function(){
		var inx = $(this).index();
		$('.ukefu-call-content .layui-tab-item').removeClass("layui-show");
		$('.ukefu-call-content .layui-tab-item').each(function(){
			if($(this).index() == inx){
				$(this).addClass("layui-show");
			}
		});		
	})
	$('#ukefu-tab_discaller').click(function(){
		var discaller = $(this).data("tab");
		var id = $(this).data("id");
		loadURL("/apps/callcenter/detail/changecalls.html?phone="+discaller+"&id="+id, "#ukefu_discaller");
	});
	$('#ukefu-tab_discalled').click(function(){
		var discalled = $(this).data("tab");
		var id = $(this).data("id");
		loadURL("/apps/callcenter/detail/changecalls.html?phone="+discalled+"&id="+id, "#ukefu_discaller");
	});
	
</script>

<script>
	<!-- 通话历史  -- 分页 -->
	layui.use(['laypage'], function() {
		var laypage = layui.laypage
		laypage.render({
			elem: 'page'
			,pages: <#if statusEventHisList??>${statusEventHisList.totalPages}<#else>0</#if> //总页数
			,curr:<#if statusEventHisList??>${statusEventHisList.number+1}<#else>0</#if>
			,groups: 5 //连续显示分页数
			,jump:function(data , first){
				if(!first){
					$.ajax({
			             type: "get",
			             url: "/apps/callcenter/detail/getStatusEventHisList",
			             data: {id:'${contacts.id!''}',p:data.curr},
			             dataType: "html",
			             success: function(res){
			            	 console.info(res);
							$("#historyList").html(res);
			               }
			         });
				}
			}
	   });
	});
	<!-- 聊天记录  -- 分页 -->
	layui.use(['laypage'], function() {
		var laypage = layui.laypage
		laypage.render({
			elem: 'agentservice_page'
			,pages: <#if agentServiceList??>${agentServiceList.totalPages}<#else>0</#if> //总页数
			,curr:<#if agentServiceList??>${agentServiceList.number+1}<#else>0</#if>
			,groups: 5 //连续显示分页数
			,jump:function(data , first){
				if(!first){
					$.ajax({
			             type: "get",
			             url: "/apps/callcenter/detail/getagentServiceList",
			             data: {id:'${statusEvent.id!''}',p:data.curr},
			             dataType: "html",
			             success: function(res){
			            	 console.info(res);
							$("#agentserviceList").html(res);
			               }
			         });
				}
			}
	   });
	});
	
</script>
